<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<link rel="stylesheet" href="../../Content/css/bootstrap.min.css" />
<link rel="stylesheet" href="../../Content/css/font-awesome.min.css" />
<link rel="stylesheet" href="../../Content/css/base.css" />
<link rel="stylesheet" href="../../Content/css/timeline.css"/>
</head>

<body>

<div class="container-fluid">
    <div class="timeline animated">
        <div class="timeline-row">
            <div class="timeline-time">21:52:25<br/>2015-2-13<br/><small>Administrator</small></div>
            <div class="timeline-icon">
                <div class="bg-primary"><i class="fa fa-pencil"></i></div>
            </div>
            <div class="panel timeline-content">
                <div class="panel-body">
                    <h2>头部</h2>
                    <p>内容</p>
                </div>
            </div>
        </div>
        
        <div class="timeline-row">
            <div class="timeline-time">21:52:25<br/>2015-2-13<br/><small>Administrator</small></div>
            <div class="timeline-icon">
                <div class="bg-warning"><i class="fa fa-quote-right"></i></div>
            </div>
            <div class="panel timeline-content">
                <div class="panel-body">
                    <h2>头部</h2>
                    <p>内容</p>
                </div>
            </div>
        </div>
        
        <div class="timeline-row">
            <div class="timeline-time">21:52:25<br/>2015-2-13<br/><small>Administrator</small></div>
            <div class="timeline-icon">
                <div class="bg-info"><i class="fa fa-camera"></i></div>
            </div>
            <div class="panel timeline-content">
                <div class="panel-body">
                   <h2>头部</h2>
                    <p>内容</p>
                </div>
            </div>
        </div>
    </div>
</div>
 

<script src="../../Scripts/jquery.min.js"></script>
<script src="../../Scripts/bootstrap.min.js"></script>
<script>
(function() {
	var timelineAnimate;
	timelineAnimate = function(elem) {
	  return $(".timeline.animated .timeline-row").each(function(i) {
		var bottom_of_object, bottom_of_window;
		bottom_of_object = $(this).position().top + $(this).outerHeight();
		bottom_of_window = $(window).scrollTop() + $(window).height();
		if (bottom_of_window > bottom_of_object) {
		  return $(this).addClass("active");
		}
	  });
	};
	timelineAnimate();
	return $(window).scroll(function() {
	  return timelineAnimate();
	});
}).call(this);
</script>

</body>
</html>
